<template>
  <view class="margin-top padding-lr">
    <view class="flex justify-between">
      <view class="text-black text-bold">搜索历史</view>
      <view class="cuIcon-delete text-gray" @tap="clearHistory">清除历史</view>
    </view>
    <view class="padding-tb flex text-cut">
      <block v-for="(item,index) in historyList" :key="index">
        <view class="padding-lr-xs" :data-index="index" @tap="clickHistory">
          <view class="cu-tag round bg-grey light">{{ item }}</view>
        </view>
      </block>
    </view>
  </view>
</template>

<script setup lang="ts">

import {defineEmits, defineProps, ref} from "vue";



const props =defineProps({
  historyList:{
    type:Array,
    default:[],
  }
})


const emits =defineEmits(['clickHistory','clearHistory'])



const clickHistory = (e:any) => {
  emits('clickHistory',props.historyList.at(e.currentTarget.dataset.index))
}

const clearHistory = () => {
  emits('clearHistory')
}

</script>

<style scoped>

</style>